<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>购物流程-2</title>
    <link rel="shortcut icon"  href="images/logo-ico2.ico"/>
    <link rel="stylesheet" type="text/css" href="css/iconfont.css" />
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" type="text/css" href="css/header-footer.css" />
    <link rel="stylesheet" href="css/Shopping-Process-1.css">
    <link rel="stylesheet" href="css/Shopping-Process-2.css">
</head>

<body>
    <div class="web">
        <!--头部-->
        <header class="header clearfix">
            <div class="fl">
                <div class="logo">
                    <a href="buerindex.html">
                        <img src="images/header-logo.png" alt="不二定制logo" />
                    </a>
                </div>
                <!--导航-->
                <ul class="nav">
                    <li><a href="buerindex.html">首页</a></li>
					<li><a href="list.html">骑行</a></li>
					<li><a href="zhuye.html">铁三</a></li>
					<li><a href="output-index.html">跑步</a></li>
					<li><a href="houtai-index.html">设计师入驻</a></li>
					<li><a href="account-data.html">品牌专区</a></li>
                </ul>
            </div>
            <div class="fr">
                <ul class="header-right">
                    <li>
                        <span class="find">
                            <input type="text" class="find-kuang" />
                            <span class="find-img">
                                <i class="iconfont icon-msnui-find-bold"></i>
                            </span>
                        </span>
                    </li>
                    <li class="width-fix">
                        <a href="">
                            <i class="iconfont icon-icon-test"></i>
                        </a>
                    </li>
                    <li class="width-fix">
                        <a href="">
                            <i class="iconfont icon-yonghu"></i>
                        </a>
                    </li>
                    <li class="width-fix">
                        <a href="" class="text">400-6563-116</a>
                    </li>
                    <li class="width-fix">
                        <a href="" class="text ch">CH</a>
                    </li>
                </ul>
            </div>
        </header>

        <!--主体内容-->
        <section class="main">
            <!-- 购物进度 -->
            <div class="jin-du">
                <ul>
                    <li class="active">
                        <div class="img-box active">
                            <a href="#">
                                <img src="images/shopping-car.png" alt="购物车">
                            </a>
                        </div>
                        <div class="describe">
                            <p class="top">
                                01
                            </p>
                            <p class="bottom">
                                我的购物车
                            </p>
                        </div>
                        <div class="time">
                            <p>
                                2016-10-09 19:10:00
                            </p>
                        </div>
                    </li>
                    <li class="active">
                        <div class="img-box active">
                            <a href="#">
                                <img src="images/check-order.png" alt="核对订单">
                            </a>
                        </div>
                        <div class="describe">
                            <p class="top">
                                02
                            </p>
                            <p class="bottom">
                                填写核对订单
                            </p>
                        </div>
                        <div class="time">
                            <p>
                                2016-10-09 19:10:00
                            </p>
                        </div>
                    </li>
                    <li>
                        <div class="img-box">
                            <a href="#">
                                <img src="images/submit-order.png" alt="提交订单">
                            </a>
                        </div>
                        <div class="describe">
                            <p class="top">
                                03
                            </p>
                            <p class="bottom">
                                成功提交订单
                            </p>
                        </div>
                    </li>
                </ul>
            </div>
            <!-- 我的购物车 -->
            <form method="GET" class="my-shopping-car">
                <!-- 收货人信息 -->
                <div class="user-detali">
                    <h2>收货人信息</h2>
                    <ul>
                        <li>
                            <div class="type important">所在地区：</div>
                            <div class="value">
                                <select name="city" id="">
                                    <option value="选择城市">选择城市</option>
                                    <option value="北京">北京</option>
                                    <option value="上海">上海</option>
                                    <option value="广州">广州</option>
                                </select>
                                <select name="district" id="">
                                    <option value="选择区">选择区</option>
                                    <option value="天河区">天河区</option>
                                    <option value="越秀区">越秀区</option>
                                    <option value="白云区">白云区</option>
                                </select>
                                <select name="district" id="">
                                    <option value="选择区">选择城市</option>
                                    <option value="天河区">天河区</option>
                                    <option value="越秀区">越秀区</option>
                                    <option value="白云区">白云区</option>
                                </select>
                            </div>
                        </li>
                        <li>
                            <div class="type important">详细地址：</div>
                            <div class="value">
                                <textarea name="" id="" cols="30" rows="10" placeholder="请填写详细地址">

                                </textarea>
                                <p>
                                    建议您如实填写详细收货地址,例如街道名称，门牌号码，楼层和房间号等信息
                                </p>
                            </div>
                        </li>
                        <li>
                            <div class="type">邮政编码：</div>
                            <div class="value">
                                <input type="text">
                                <p>
                                    如您不清楚邮递区号，请填写000000
                                </p>
                            </div>
                        </li>
                        <li>
                            <div class="type important">收货人姓名：</div>
                            <div class="value">
                                <input type="text">
                            </div>
                        </li>
                        <li>
                            <div class="type">手机号码：</div>
                            <div class="value">
                                <select name="" id="">
                                    <option value="+86">
                                        中国大陆+86
                                    </option>
                                    <option value="+86">
                                        中国大陆+86
                                    </option>
                                    <option value="+86">
                                        中国大陆+86
                                    </option>
                                    <option value="+86">
                                        中国大陆+86
                                    </option>
                                </select>
                                <input type="tel" name="" id="">
                            </div>
                        </li>
                        <li>
                            <div class="type">电话号码：</div>
                            <div class="value">
                                <select name="" id="">
                                    <option value="+86">
                                        中国大陆+86
                                    </option>
                                    <option value="+86">
                                        中国大陆+86
                                    </option>
                                    <option value="+86">
                                        中国大陆+86
                                    </option>
                                    <option value="+86">
                                        中国大陆+86
                                    </option>
                                </select>
                                <input type="text" placeholder="区号">
                                <span></span>
                                <input type="tel" name="" id="" placeholder="电话号码">
                                <span></span>
                                <input type="text" placeholder="分机">
                                <p>
                                    手机号码和电话号码必须填一项
                                </p>
                            </div>
                        </li>
                        <li>
                            <div class="type"></div>
                            <div class="value">
                                <input type="button" value="保存收货人信息">
                                <input type="checkbox" name="add" id="add" checked>
                                <label for="add">
                                    <img src="images/add-chick.jpg" alt="勾选添加">
                                </label>
                                <label for="add">
                                    添加常用地址
                                </label>
                            </div>
                        </li>
                    </ul>
                </div>

                <!-- 支付方式 -->
                <div class="pay-way">
                    <!-- 标题  -->
                    <h2>支付方式及配送</h2>
                    <ul>
                        <li>
                            <div class="type">
                                支付方式：
                            </div>
                            <div class="value">
                                在线支付
                            </div>
                        </li>
                        <li>
                            <div class="type">
                                配送方式：
                            </div>
                            <div class="value">
                                普通快递
                            </div>
                        </li>
                        <li>
                            <div class="type">
                                运费：
                            </div>
                            <div class="value">
                                0元
                            </div>
                        </li>
                        <li>
                            <div class="type">
                                送货日期：
                            </div>
                            <div class="value">
                                <p>
                                    工作日／双休日与假日均可送货
                                </p>
                                <p>
                                    正常情况 商品生产至配送到您手中预计一周左右时间，支持送货上门
                                </p>
                            </div>
                        </li>
                    </ul>
                </div>

                <!-- 发票信息 -->
                <div class="fa-piao">
                    <h2>发票信息</h2>
                    <span>订单发票：</span>
                    <span>
                        无发票
                    </span>
                </div>
                <!-- 标题  -->
                <h2>商品清单</h2>
                <!-- 表格 -->
                <table>
                    <tr>
                        <th>商品</th>
                        <th>名称</th>
                        <th>尺码</th>
                        <th>数量</th>
                        <th>优惠</th>
                        <th>单价</th>
                    </tr>
                    <tr>
                        <td>
                            <div class="img-box">
                                <img src="images/santic-woman-1.png" alt="女装短袖">
                            </div>
                        </td>
                        <td>
                            <p>
                                Santic森地客 春秋骑行服自行车骑行长袖套装冬季骑行长裤男(含1件样衣)
                            </p>
                            <p>
                                性别：女
                            </p>
                        </td>
                        <td>
                            XXL
                        </td>
                        <td>
                            2
                        </td>
                        <td class="active">
                            9.5折

                        </td>
                        <td class="active">
                            ￥299.00
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <div class="img-box">
                                <img src="images/santic-woman-1.png" alt="女装短袖">
                            </div>
                        </td>
                        <td>
                            <p>
                                Santic森地客 春秋骑行服自行车骑行长袖套装冬季骑行长裤男(含1件样衣)
                            </p>
                            <p>
                                性别：女
                            </p>
                        </td>
                        <td>
                            XXL
                        </td>
                        <td>
                            2
                        </td>
                        <td class="active">
                            9.5折

                        </td>
                        <td class="active">
                            ￥299.00
                        </td>
                    </tr>
                </table>

                <!-- 结算 -->
                <div class="settle-accounts">
                    <div>
                        <span>客户备注：</span>
                        <input type="text" name="" id="">
                        <div class="price">
                            <p class="top">
                                <span>2件商品 总计：</span>
                                <span>
                                    ￥99.00
                                </span>
                            </p>
                            <p class="bottom">
                                <span>
                                    优惠：
                                </span>
                                <span>
                                    ￥0.00
                                </span>
                            </p>
                        </div>
                    </div>
                    <div>
                        <span>
                            总计（不含运费）：
                        </span>
                        <span>
                            ￥146.00
                        </span>
                    </div>
                    <button class="next"><a href="Shopping-Process-3.html">去结算</a></button>
                </div>
            </form>
            <!-- 服务 -->
            <div class="service">
                <ul>
                    <li>
                        <span>
                            定
                        </span>
                        <span>
                            100%个性定制
                        </span>
                    </li>
                    <li>
                        <span>
                            正
                        </span>
                        <span>
                            100%正品保证
                        </span>
                    </li>
                    <li>
                        <span>
                            7
                        </span>
                        <span>
                            7天闪电发货
                        </span>
                    </li>
                    <li>
                        <span>
                            退
                        </span>
                        <span>
                            30天无忧退换
                        </span>
                    </li>
                    <li>
                        <span>
                            <img src="images/hot-line.png" alt="热线服务">
                        </span>
                        <span>
                            365天客服热线
                        </span>
                    </li>
                </ul>
            </div>
        </section>
        <!--底部-->
        <footer class="footer">
            <div class="footer-content">
                <div class="footer-logo">
                    <a href="index.html">
                        <img src="images/footer-logo.png" alt="页脚logo" />
                    </a>
                </div>
                <ul>
                    <li>新手指南</li>
                    <li>用户注册</li>
                    <li>定制流程</li>
                </ul>
                <ul>
                    <li>付款方式</li>
                    <li>支付方式</li>
                    <li>支付问题</li>
                    <li>常见问题</li>
                </ul>
                <ul>
                    <li>售后服务</li>
                    <li>退款换货</li>
                    <li>配送方式</li>
                    <li>联系我们</li>
                </ul>
                <ul>
                    <li>政策条款</li>
                    <li>服务协议</li>
                    <li>隐私条款</li>
                    <li>版权条款</li>
                </ul>
            </div>
            <div class="copy"> © 2016 Wildto Corpation. All Rights Reserved闽ICP备14001544号-1 </div>
        </footer>
    </div>

</body>

</html>